<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>day05_demo04</title>
<script>
	function pf(){
		//获取文本框
		var input=document.getElementById("num");
		//获取框内的值
		var n=input.value;
		//获取span
		var span=document.getElementById("result");
		
		//判断该值是不是数字
		if(isNaN(n)){
			//不是数字，给予提示
			span.innerHTML="请输入数字";
			
		}else{
			//是数字，计算平方
			span.innerHTML=n*n;
		}
	}

</script>



<style>
	#num{
		text-align:center;
	}
	
	#result{
		display:inline-block;
	}
	
	div>#result{
		border:2px solid red;
		width:40px;
		height:15px;
		padding:1px; 
		
	
	}
	
	
</style>

</head>
<body>
	<div>
		<input type="text" id="num" />
		<input type="button" value="平方"
			onclick="pf();"/>
		=<span id="result"></span>
	 </div>
</body>
</html>